<template>
  <div>
    <ComDialog
      title="修改拨比"
      :dialogVisible="EditDialogVisible"
      @EventClose="closeFn"
    >
      <el-form
        :model="editForm"
        :rules="rules"
        ref="editForm"
        label-width="130px"
        class="demo-editForm"
      >
        <el-form-item label="消费类型">{{ current }} </el-form-item>
        <el-form-item label="角色">{{ editForm.postionName }} </el-form-item>
        <el-form-item label="职等">{{ editForm.levelName }} </el-form-item>

        <template>
          <el-form-item label="拨比方式" prop="commisionType">
            <el-select v-model="editForm.commisionType">
              <el-option
                v-for="(item, index) in levelOptions"
                :key="index"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </template>

        <el-form-item label="拨比/分钟（元）" prop="commision">
          <el-input
            style="width: 220px"
            placeholder="请输入金额"
            v-model.number="editForm.commision"
          ></el-input>
        </el-form-item>

        <el-form-item>
          <el-button @click="closeFn">取消</el-button>
          <el-button
            type="primary"
            v-hasPermi="['financial:commision:edit']"
            @click="saveFn"
            >保存</el-button
          >
        </el-form-item>
      </el-form>
    </ComDialog>
  </div>
</template>
<script>
import ComDialog from "../../../components/comDialog.vue";
import { getCommisionGetInfoApi } from "@/wss/api/financial/commision.js";

export default {
  props: {
    //  价格类型
    priceType: {
      type: String,
      default: "出错",
    },
    // 是否显示对话框
    EditDialogVisible: {
      type: Boolean,
      default: false,
    },
  },
  components: { ComDialog },
  data() {
    return {
      // 收费方式
      levelOptions: [
        { label: "按比例", value: "1" },
        { label: "按次数", value: "2" },
        { label: "按时长", value: "3" },
      ],
      editForm: {
        id: "",
        positionId: "",

        level: "",
        // 比率方式
        commisionType: "",
        // 拨比金额
        commision: "",
        status: "",
      },
      rules: {
        commision: [
          {
            required: true,
            type: "number",
            message: "无效",
            trigger: "blur",
          },
        ],
        commisionType: [{ required: true, trigger: "change", message: "无效" }],
      },
    };
  },

  computed: {
    current() {
      for (const key in this.editForm) {
        // / 1图文 2在线 3电话 4现场 5文档 6充值 7VIP /
        let str = null;
        if (key === "type") {
          switch (this.editForm[key]) {
            case "1":
              if (this.editForm.consultType) {
                str = "图文-";
                str += this.editForm.consultType == 1 ? "合同代拟" : "合同审核";
              }
              return str;
            case "2":
              return "在线";
            case "3":
              return "电话";
            case "4":
              if (this.editForm.consultType) {
                str = "现场-";
                str += this.editForm.consultType == 1 ? "合同代拟" : "合同审核";
              }
              return str;
            case "5":
              return "文档";
            case "6":
              return "充值";
            case "7":
              return "VIP";
            default:
              break;
          }
        }
      }
    },
  },
  methods: {
    // id获取详细
    async getDetailFn(row) {
      const { code, msg, data } = await getCommisionGetInfoApi({
        id: row.idStr,
      });
      if (code == 200) {
        console.log(data);
        this.editForm = data;
        console.log(this.editForm, "editForm");
      }
    },

    // 修改的保存 按钮
    async saveFn() {
      try {
        // 检查是否通过
        this.$refs.editForm.validate();
        let paramsData = JSON.parse(JSON.stringify(this.editForm));
        paramsData.id = paramsData.idStr;
        paramsData.commision = paramsData.commision.toFixed(2);
        paramsData.positionId = paramsData.positionIdStr;
        this.$emit("EventEdit", paramsData);
      } catch (error) {
        this.$modal.msgError("输入无效");
      }
    },
    // 关闭对话框
    async closeFn() {
      (this.editForm = {
        id: "",
        positionId: "",

        level: "",
        // 比率方式
        commisionType: "",
        // 拨比金额
        commision: "",
        status: "",
      }),
        this.$refs.editForm.resetFields();

      // 关闭对话框 =>  重新获取列表数据 $emit返回该组件实例
      this.$emit("update:EditDialogVisible", false);
    },
  },
};
</script>